<template>
	<view class="container">
		<titlebara text="订单通知" img="@appstatic/message/message_icon_titlebar.png" :back="true" @rightIconClick="allRead"
			:text="text" backgroundColor='#f5f5f5'>
		</titlebara>
		<scroll-view scroll-y="true" @scrolltolower="handleToLower"
			:style="'top:'+navigationBarHeight+'px ;'+'height:'+contentHeight+'px;width: 100%;position:fixed;'">
			<view class="order-message-list">
				<view v-for="(item,index) in orderList" class="row" @click="getLevcMessage(item)">
					<!-- <view class="head"> -->
					<view class="left">
						<view style="width: 6px;height: 22px;">
							<view v-if="item.isReady!==1" style="padding-bottom: 4px;width: 6px;height:6px"></view>
							<image v-if="item.isReady==1" style="padding-bottom: 4px;width: 6px;height:6px;"
								src="@appstatic/message/message_icon_iteract_dot.png" mode="aspectFit"></image>
						</view>
						<view style="" class="ellipsis">
							<text
								style="line-height: 19.6px;font-weight: 500,medium;font-size: 28upx;">{{item.context}}</text>
							<text
								style="color: #ADB0AE;font-weight: 400;font-size: 28upx;line-height: 20px;padding-top: 8px;">{{item.sendTime}}</text>
						</view>
					</view>
					<!-- <view class="time">
							<text>{{item.sendTime}}</text>
						</view> -->
					<!-- </view> -->
				</view>
			</view>
			<empty v-if='!orderList.length' text='暂无订单数据' />
		</scroll-view>
		<view class="bimg">
			<image style="width:100%;height:100%" src="@appstatic/message/message_icon_order_background.png" mode="">
			</image>
		</view>
	</view>
</template>

<script>
	import empty from '@components/empty/empty.vue'
	import titlebara from '@/components/titlebar/titlebar'
	const app = getApp();
	const util = require("@utils/util.js");
	const network = require("@manager/network-manager.js");
	const dialog = require("../../utils/dialog.js");
	export default {
		components: {
			titlebara,
			empty
		},
		data() {
			return {
				text: "订单通知",
				img: "@appstatic/message/message_icon_titlebar.png",
				orderList: [],
				pagination: {
					loadmore: true,
					page: 1, //当前页
					totalPage: 1, //总页
					limit: 20,
					length: 100
				},
				total: '',
				allList: [],
				navigationBarHeight: app.globalData.navigationBarHeight,
				contentHeight: app.globalData.windowHeight - app.globalData.navigationBarHeight - (app.globalData.tabBarHeight),
				fromType:'message'
			}
		},
		// onShow: function(options) {
		// 	let pages = getCurrentPages();
		// 	let prePage = pages[pages.length - 2];
		// 	prePage.refresh();
		// },
		//
		// onNavigationBarButtonTap:function(){

		// },
		onLoad: function(options) {
			// this.loadData(true);
			if (util.isLogin(getApp())) {
				this.$fire.$on('orderMsg', function() {
					this.showOrderList(true);
				});
			}
			if(options.from){
				this.fromType=options.from
			}
		},
		onShow: function(options) {
			this.showOrderList(true);
		},
		mounted() {
			// this.showOrderList(true);
		},
		methods: {
			handleToLower() {
				//触底
				var that = this;
				if (that.pagination.loadmore) { //有下一页
					// that.params.page+=1;
					that.pagination.page += 1;
					this.showOrderList(false)
				} else {
					uni.showToast({
						title: "暂无更多数据",
						duration: 3000,
						icon: 'none'
					})
				}
			},
			async showOrderList(isRefresh) {
				var that = this;
				var uri = app.globalData.config.interfaces.URL_SYS_SENDMSG_GETLEVCMSG_TYPE;
				var params = {
					"pageNum": isRefresh ? 1 : that.pagination.page,
					"pageSize": that.pagination.limit, //
					"isType": 1
				};
				network.get(uri, params, 'form').then(res => { //form/json
					console.log(res.data);
					if (res.code == 200) {
						var _list = res.data.list;
						that.total = res.data.total;
						if (isRefresh) {
							//总页数
							var totalPage = Math.ceil(res.data.total / that.pagination.limit);
							that.pagination.totalPage = totalPage;
							//length
							that.pagination.length = res.data.total;
							//停止下拉
							uni.stopPullDownRefresh()
							that.orderList = _list ? _list : []
						} else {
							if (_list && _list.length > 0) {
								that.orderList = [...that.orderList, ..._list]
							}
						}
						if (that.pagination.page == that.pagination.totalPage) {
							that.pagination.loadmore = false
						}

						// //传值 是否全部已读
						// var read=2
						// for(var i=0;i<that.orderList.length;i++){
						// 	console.log(that.orderList)
						// 	if(that.orderList[i].isReady==1){
						// 		read=1
						// 	}
						// }
						// // setTimeout(()=>{
						// 	uni.$on('ordersend',()=>{
						// 		uni.$emit("orderread",{read:read})
						// 	})
						// 	// uni.$emit("read",{read:read})
						// // },500)

					} else {
						uni.showToast({
							title: res.message,
							duration: 3000,
							icon: 'none'
						})
					}
				}).catch(res => {
					uni.stopPullDownRefresh();
					uni.showToast({
						title: res.errMsg,
						duration: 3000,
						icon: 'none'
					})
					console.error(res);
				})

			},
			refresh(id) {
				console.log(this.orderList)
				var list = this.orderList
				var length = this.orderList.length
				for (var i = 0; i < length; i++) {
					if (id == list[i].id) {
						list[i].isReady = 2
					}
				}
			},
			//点击消息 查看详情
			getLevcMessage(item) {
				if (item.subType == 4) {
					uni.navigateTo({
						url: "/module_my/pages/myMaintainDetail/myMaintainDetail?model=repair&id=" +item.relationId+ "&myId=" + item.id + "&from="+this.fromType ,

					});
				} else if (item.subType == 5) {
					uni.navigateTo({
						url: "/module_my/pages/myMaintainDetail/myMaintainDetail?model=maintain&id=" +item.relationId+ "&myId=" + item.id  + "&from="+this.fromType,
					});
				} else {
					var uri = app.globalData.config.interfaces.URL_GET_CARORDER_ORDER;
					var params = {
						// "id":item.id
						"id": item.relationId,
						"loginId": app.globalData.userInfo.id
					};
					network.get(uri, params, 'form').then(res => {
						console.log(res)
						if (res.code == 200) {
							uni.navigateTo({
								url: '/module_my/pages/orderDetail/orderDetail?id=' + res.data.id +
									"&from="+this.fromType + "&myId=" + item.id,
							});


						} else {
							uni.showToast({
								title: res.message,
								duration: 3000,
								icon: 'none'
							})
						}
					}).catch(res => {
						console.error(res, 'err');
						uni.showToast({
							title: res.errMsg,
							duration: 3000,
							icon: 'none'
						})
					})
				}



			},
			//一键已读
			allRead() {
				var uri = app.globalData.config.interfaces.URL_SYS_SENDMSG_UPDATE_LEVCMSGUSERREADY;
				var params = {
					"isType": 1
				}
				network.post(uri, params, 'json').then(res => {
					debugger
					if (res.code == 200) {
						//刷新前一页
						let pages = getCurrentPages();
						if (pages.length == 2) {
							let prePage = pages[pages.length - 2];
							// #ifdef H5
							prePage.refresh();
							// #endif

							// #ifdef APP-PLUS
							prePage.$vm.refresh();
							// #endif
						}
						this.showOrderList(true);
						util.syncBadge(getApp())
					}
				})
			}
		}
	}
</script>
<style>
	page {
		background-color: #F5F5F5;
	}
</style>
<style scoped>
	.container {
		/* background-color: #F5F5F5; */
	}

	.order-message-list {
		/* padding-top:45px; */
		height: 100vh;

		display: flex;
		flex-direction: column;
		padding-left: 16px;
		padding-right: 24px;
	}

	.bimg {
		width: 220.24px;
		height: 244.17px;
		position: fixed;
		right: 0px;
		bottom: 60px
	}

	.row {
		/* height: 36px; */
		padding-top: 16px;
		padding-bottom: 16px;
		border-bottom: solid #EDEDED 1px;
		/* display: flex;
		flex-direction: column; */
	}

	.head {
		padding-top: 8px;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		vertical-align: middle;
	}

	.left {
		display: flex;
		flex-direction: row;
		/* vertical-align: middle;
		align-items: center;
		width: 200px; */
	}

	.time {
		font-size: 14px;
		font-weight: 400;
		line-height: 19.6px;
		color: #ADB0AE;
	}

	.ellipsis {
		display: flex;
		flex-direction: column;
		padding-left: 4px;
	}

	.showMore {
		width: 24px;
		height: 24px;
		position: absolute;
		left: 44px;
		top: calc(50% - 12px);
		/*#ifdef APP-PLUS||H5*/
		left: calc(100% - 36px);
		/*#endif*/
	}

	.titleText {
		color: #3D3A3A;
		text-align: center;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		font-weight: 600;
		font-size: 16px;
		align-items: center;
		display: flex;
		position: absolute;
		top: calc(50% - 10px);
		left: calc((100% - 40px)/2);
	}
</style>
